


import React, { lazy, Suspense, useEffect, useState } from 'react'
import { Layout } from 'antd';
import Head from './head';
import Side from './sider';
import Foot from './foot';
import { Route, Switch, Redirect } from 'react-router-dom';
import Loading from '../../components/loading';
import "./index.scss"
import { observer, inject } from 'mobx-react';
import { ajax } from '../../api';

function MainIndex({ user }: any) {
    const { userInfo, changeUserInfo } = user
    useEffect(() => {
        getInfo()

    }, [])

    const getInfo = async () => {
        let { code, result }: any = await ajax.getuserInfo()
        if (code == 200) {
            changeUserInfo(result)
        }
    }
    useEffect(() => {
        getInfo()
        let a = localStorage.getItem("zise")
        let b = localStorage.getItem("lanse")
        let c = localStorage.getItem("fense")
        if (a) {
            setBack(a)
        } else if (b) {
            setBack(b)
        } else if (c) {
            setBack(c)
        }
    }, [])


    const chanehuan = () => {
        console.log(1111);
    }

    const [background, setBack]: any = useState("#000000")
    console.log(background);


    const { Header, Footer, Sider, Content } = Layout;
    return (
        <div style={{ width: '100%', height: '100%', background: background }} className='back'>
            <Layout style={{ width: '100%', height: '100%' }}>
                <Header >
                    <Head />
                </Header>
                <Layout style={{ display: 'flex', height: '100%' }}>
                    <Sider>
                        <Side />
                    </Sider>
                    <Layout style={{ padding: '20px 30px 0', background: "rgba(115, 103, 103, 0.3)" }}>
                        <Suspense fallback={Loading()}>
                            <Switch>
                                <Route path="/main/" exact component={() => (<Redirect to="/main/home" />)} />
                                <Route path="/main/home" component={lazy(() => import("../home/home"))} />
                                <Route path="/main/mine" component={lazy(() => import("../mine/mine"))} />
                                <Route path="/main/vip" component={() => (
                                    <Switch>
                                        <Route path="/main/vip/list" component={lazy(() => import('../vip/viplist'))} />
                                        <Route path="/main/vip/add" component={lazy(() => import('../vip/vipadd'))} />
                                        <Route path="/main/vip/del" component={lazy(() => import('../vip/vipdel'))} />
                                    </Switch>
                                )} />
                                <Route path="/main/user" component={() => (
                                    <Switch>
                                        <Route path="/main/user/list" component={lazy(() => import('../user/userlist'))} />
                                        <Route path="/main/user/add" component={lazy(() => import('../user/useradd'))} />
                                    </Switch>
                                )} />
                                <Route path="/main/form" component={() => (
                                    <Switch>
                                        <Route path="/main/form/list" component={lazy(() => import('../form/formlist'))} />
                                    </Switch>
                                )} />
                                <Route path="/main/produce" component={() => (
                                    <Switch>
                                        <Route path="/main/produce/list" component={lazy(() => import('../produce/producelist'))} />
                                        <Route path="/main/produce/add" component={lazy(() => import('../produce/produceadd'))} />
                                    </Switch>
                                )} />
                                <Route path="/main/activity" component={() => (
                                    <Switch>
                                        <Route path="/main/activity/list" component={lazy(() => import("../activity/activityList"))} />
                                        <Route path="/main/activity/add" component={lazy(() => import("../activity/activityAdd"))} />

                                    </Switch>
                                )} />
                                <Route path="/main/anno" component={() => (
                                    <Switch>
                                        <Route path="/main/anno/list" component={lazy(() => import('../anno/annolist'))} />
                                        <Route path="/main/anno/add" component={lazy(() => import('../anno/annoadd'))} />
                                        <Route path="/main/anno/detail" component={lazy(() => import('../anno/annodetail'))} />
                                        <Route path="/main/anno/dit" component={lazy(() => import('../anno/annodit'))} />
                                    </Switch>
                                )} />
                                <Route path="/main/time" component={() => (
                                    <Switch>
                                        <Route path="/main/time/card" component={lazy(() => import("../time/card"))} />
                                        <Route path="/main/time/time" component={lazy(() => import("../time/time"))} />
                                    </Switch>
                                )} />
                                <Route path="/main/SkinSwitch" component={() => (

                                    < Switch>
                                        <Route path="/main/SkinSwitch/skinSwitch" component={lazy(() => import("../SkinSwitch/SkinSwitch"))} />
                                        <Route path="/main/SkinSwitch/shuffling" component={lazy(() => import("../SkinSwitch/shuffling"))} />

                                    </Switch>
                                )} />

                                <Route component={() => (<Redirect to="/404" />)} />
                            </Switch>
                        </Suspense>
                        <Footer>
                            <Foot />
                        </Footer>
                    </Layout>
                </Layout>
            </Layout>
        </div >
    )
}

export default inject("user")(observer(MainIndex))
